<%-- 
    Document   : XemDuongDi
    Created on : May 22, 2011, 3:01:41 PM
    Author     : ToanNhan
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>
<script type="text/javascript" src="http://code.google.com/apis/gears/gears_init.js"></script>
<script type="text/javascript">
    var directionDisplay;
    var directionsService = new google.maps.DirectionsService();

    var initialLocation;    
    var browserSupportFlag =  new Boolean();
    var map;    
    var shopLocation=new google.maps.LatLng(10.762827,106.682551);
    function initialize() {
        directionDisplay = new google.maps.DirectionsRenderer();
        var myOptions = {
            zoom: 6,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
        directionDisplay.setMap(map);
        // Try W3C Geolocation method (Preferred)
        if(navigator.geolocation) {
            browserSupportFlag = true;
            navigator.geolocation.getCurrentPosition(function(position) {
                initialLocation = new google.maps.LatLng(position.coords.latitude,position.coords.longitude);                
                map.setCenter(initialLocation);
                findDirection();
            }, function() {
                handleNoGeolocation(browserSupportFlag);
            });
        } else if (google.gears) {
            // Try Google Gears Geolocation
            browserSupportFlag = true;
            var geo = google.gears.factory.create('beta.geolocation');
            geo.getCurrentPosition(function(position) {
                initialLocation = new google.maps.LatLng(position.latitude,position.longitude);                
                map.setCenter(initialLocation);
                findDirection();
            }, function() {
                handleNoGeolocation(browserSupportFlag);
            });
        } else {
            // Browser doesn't support Geolocation
            browserSupportFlag = false;
            
        }
    }
    function findDirection(){
        var request = {
            origin:initialLocation,
            destination:shopLocation,
            travelMode: google.maps.TravelMode.DRIVING
        };
        directionsService.route(request, function(result, status) {
            if (status == google.maps.DirectionsStatus.OK) {
                directionDisplay.setDirections(result);
            }
        });

    }
</script>

<body onload="initialize()">
    <div id="map_canvas" style="width:100%; height:300px;border: 1px solid blue;"></div>
</body>

